<template>
	<view class="container">
		<view class="example">
			<uni-forms ref="baseForm" :modelValue="baseFormData">
				<uni-forms-item label="单据编码">
					<uni-easyinput disabled="" v-model="baseFormData.bill_code" placeholder="" />
				</uni-forms-item>
				<uni-forms-item label="申请日期">
					<uni-easyinput disabled v-model="baseFormData.apply_date" placeholder="" />
				</uni-forms-item>
				<uni-forms-item label="创建时间">
					<uni-easyinput disabled v-model="baseFormData.creationtime" placeholder="" />
				</uni-forms-item>
				<uni-forms-item label="制单人">
					<uni-easyinput disabled v-model="baseFormData.creatorname" placeholder="" />
				</uni-forms-item>
			</uni-forms>
		</view>
		<view class="bodylist-views" v-for="(item,index) in bodylist" :key="index">
			<view class="bodylist-view">
				<view class="bodylist-image-left">
					<image @click="del(index)" class="bodylist-image" src="../../static/delete.png" mode=""></image>
				</view>
				<view class="">
					<text>补卡明细</text>
				</view>
				<view class="bodylist-image-right">
					<image @click="isshow(index)" v-if="item.isshow" class="bodylist-image"
						src="../../static/Packup.png" mode=""></image>
					<image @click="isshow(index)" v-else class="bodylist-image" src="../../static/show.png" mode="">
					</image>
				</view>
			</view>
			<view class="body-form" v-if="item.isshow">
				<uni-forms-item label="签卡时间">
					<view class="formdateinput" @click="DatePicker('datetime',index)">
						<uni-easyinput :disabled='isdisabled' v-model="item.signtime" placeholder="请选择"
							suffixIcon="bottom" />
					</view>
				</uni-forms-item>
				<uni-forms-item label="签卡原因">
					<hpy-form-select :disabled='isdisabled' :dataList="hobbyList" text="text" name="value"
						v-model="item.signreason" />
				</uni-forms-item>
				<uni-forms-item label="签卡说明">
					<uni-easyinput :disabled='isdisabled' v-model="item.signremark" placeholder="" />
				</uni-forms-item>
			</view>
		</view>
		<view class="form-createbtn">
			<wyb-button v-if="isdisabled == false" @click="submit()" color="rgb(80, 148, 242)" class="btn"
				width="250rpx" height="70rpx" type="filled">提交申请
			</wyb-button>
		</view>
		<mx-date-picker format="yyyy-mm-dd hh:ii:ss"  :show="showPicker" :type="type" :value="value" :show-tips="true"
			:show-seconds="true" @confirm="ed" @cancel="ed" />
		<wm-list-add v-if="isdisabled == false" ref="add" @clickAdd="clickAdd" />

	</view>
</template>

<script>
	import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue";
	import wmListAdd from '@/components/wm-list-add/wm-list-add';
	import {
		request
	} from '@/util/ajax.js';
	import {
		hpyformselect
	} from '@/components/hpy-form-select/hpy-form-select.vue';
	import {
		getyhtUserId
	} from '@/components/js/queryuserid'

	export default {
		components: {
			MxDatePicker,
			wmListAdd
		},
		data() {
			return {
				// 基础表单数据
				baseFormData: {
					creatorname: '',
					apply_date: "",
					creationtime: "",
					bill_code: "",
					billmaker: "",
					creator: "",
					pk_psndoc: ""
				},
				bodylist: [{
					pk_group: "hgjt",
					signdate: "", //年月日
					signtime: "", //年月日时分秒
					signreason: "",
					signremark: "",
					isshow: true
				}],
				hobbyList: [],
				showPicker: false,
				type: 'datetime',
				value: '',
				index: '',
				isdisabled: false,
			}
		},
		created() {
			let self = this
			this.baseFormData.creationtime = this.getNowTime('datetime')
			this.baseFormData.apply_date = this.getNowTime('date')
			request({
				methods: 'GET',
				url: "/hgjt-be/mobile/nc/queryBKReason",
			}).then(res => {
				res = res.data
				if (res.code == 0) {
					res.data.forEach(items => {
						let item = {
							value: items.code,
							text: items.name
						}
						this.hobbyList.push(item)
					});
				}
			})
			setTimeout(() => {
				let createUserId = sessionStorage.getItem('xyyluserid');
				createUserId = JSON.parse(createUserId);
				//alert(JSON.stringify(createUserId))
				self.baseFormData.creatorname = createUserId.userName;
				self.baseFormData.billmaker = createUserId.userCode;
				self.baseFormData.creator = createUserId.userCode;
				self.baseFormData.pk_psndoc = createUserId.userCode;
			}, 500);
		},
		computed: {

		},
		onLoad() {
			getyhtUserId()
		},
		onReady() {

		},
		methods: {
			onClickItem(e) {
				console.log(e);
				this.current = e.currentIndex
			},
			isshow(index) {
				this.bodylist[index].isshow = !this.bodylist[index].isshow;
			},
			del(index) {
				if (this.isdisabled) {
					return;
				}
				if (this.bodylist.length > 1) {
					let self = this
					uni.showModal({
						title: '提示',
						content: '确定删除这条明细吗？',
						success: function(res) {
							if (res.confirm) {
								self.bodylist.splice(index, 1)
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});

				} else {
					uni.showToast({
						title: '至少需要一条明细！',
						icon: 'none',
						duration: 2000
					});
				}

			},
			submit(ref) {
				if (this.isdisabled) {
					return;
				}
				let self = this
				let parms = {
					id: "",
					pk_group: "hgjt",
					bill_code: "",
					apply_date: this.baseFormData.apply_date,
					billmaker: this.baseFormData.billmaker,
					creator: this.baseFormData.creator,
					creationtime: this.baseFormData.creationtime,
					pk_psndoc: this.baseFormData.pk_psndoc,
					ishrssbill: "Y",
					billBodyVOList: []
				}
				let billBodyVOList = JSON.parse(JSON.stringify(this.bodylist))
				let nowdate = this.getNowTime()
				let isreturn
				billBodyVOList.forEach((items, index) => {
					if (items.signtime == "") {
						uni.showToast({
							title: `第${index+1}条的签卡时间不能为空`,
							icon: 'none'
						})
						isreturn = false;
						return;
					} else if (items.signreason == "") {
						uni.showToast({
							title: `第${index+1}条的签卡原因不能为空`,
							icon: 'none'
						})
						isreturn = false;
						return;
					} else if (new Date(nowdate).getTime() < new Date(items.signtime.replace(/-/g, '/'))
					.getTime()) {
						uni.showToast({
							title: `第${index+1}条的签卡时间不能大于当前时间`,
							icon: 'none'
						})
						isreturn = false;
						return;
					} else {
						items.signstatus = "2";
						// items.signtime = items.signtime + ' 00:00:00'
						items.signdate = items.signtime.slice(0, 10)
						delete items.isshow
						isreturn = true;
					}
				});

				if (isreturn) {
					parms.billBodyVOList = billBodyVOList
					request({
						methods: 'POST',
						url: "/hgjt-be/mobile/nc/BK",
						data: parms,
					}).then(res => {
						res = res.data
						if (res.successful == 'Y') {
							self.isdisabled = true
							self.baseFormData.bill_code = res.content
							uni.showToast({
								title: "提交成功"
							})
						} else {
							uni.showModal({
								title: '提交错误',
								content: res.resultdescription,
							});
						}
					})
				} else {
					return;
				}


			},
			DatePicker(type, index) { //显示
				if (this.isdisabled) {
					return;
				}
				this.type = type;
				this.showPicker = true;
				this.index = index;
			},
			ed(e) { //选择
				this.showPicker = false;
				if (e) {
					this.bodylist[this.index].signtime = e.value;
					//选择的值
					console.log('value => ' + e.value);
					//原始的Date对象
					console.log('date => ' + e.date);
				}
			},
			clickAdd() {
				if (this.isdisabled) {
					return;
				}
				var item = {
					pk_group: "hgjt",
					signdate: "", //年月日
					signtime: "", //年月日时分秒
					signreason: "",
					signremark: "",
					isshow: true
				}
				this.bodylist.push(item)
			},
			getNowTime(type) {
				let now = new Date();
				let year = now.getFullYear(); //获取完整的年份(4位,1970-????)
				let month = now.getMonth() + 1; //获取当前月份(0-11,0代表1月)
				let today = now.getDate(); //获取当前日(1-31)
				let hour = now.getHours(); //获取当前小时数(0-23)
				let minute = now.getMinutes(); //获取当前分钟数(0-59)
				let second = now.getSeconds(); //获取当前秒数(0-59)
				let nowTime = ''
				if (type == 'datetime') {
					nowTime = year + '-' + this.fillZero(month) + '-' + this.fillZero(today) + ' ' + this.fillZero(
							hour) +
						':' +
						this.fillZero(minute) + ':' + this.fillZero(second)
				} else {
					nowTime = year + '-' + this.fillZero(month) + '-' + this.fillZero(today)
				}

				return nowTime
			},
			fillZero(str) {
				var realNum;
				if (str < 10) {
					realNum = '0' + str;
				} else {
					realNum = str;
				}
				return realNum;
			}
		}
	}
</script>

<style lang="scss">
	.body-form {
		padding: 10px;
	}

	.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		margin-left: 10px;
	}

	.bodylist-image {
		width: 30rpx;
		height: 30rpx;
	}

	.bodylist-views {
		background-color: #FFFFFF;
	}

	.bodylist-view {
		display: flex;
		justify-content: space-between;
		margin-top: 15px;
		height: 70rpx;
		align-items: center;
	}

	.bodylist-image-left {
		margin-left: 20rpx;
	}

	.bodylist-image-right {
		margin-right: 20rpx;
	}

	.form-createbtn {
		display: flex;
		justify-content: center;
		margin-top: 20px;
		height: 100px;
	}

	.formdateinput .uni-easyinput {
		pointer-events: none;
	}
</style>
